<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>10_修改对象的属性-自定义属性</title>
    </head>
    <body>
        <div id="d1" aa="bb">今天是星期五</div>

        <button id="btn">按钮</button>

        <script>
            var btn = document.getElementById('btn');

            btn.onclick = function(){
                var d1 = document.getElementById('d1');


                // （1）获取自定义属性
                // 自定义属性是不可以通过点语法和中括号语法获取的
                // console.log(d1.aa);
                // console.log(d1['aa']);

                // 获取自定义属性 可以通过getAttribute这个方法来获取
                // 参数是属性名字
                // console.log(d1.getAttribute('aa'));

                // （2）设置自定义属性
                // 设置自定义属性也不可以通过点语法和中括号语法
                d1.aa = 'cc';
                d1['aa'] = 'cc';

                // 可以通过setAttribute来设置自定义属性
                // 参数的第一个值是属性名字  第二个值是属性值
                d1.setAttribute('aa','cc');



            }
        </script>
    </body>
</html>